Pinia

Nuxt3 雖然可以使用 useStore 方法來操作 vuex，但是既然都是基於 Vue3 了，使用 pinia 來管理比較順手一點，雖然 Pinia 有針對 Nuxt 安裝的說明文件，但是安裝上可能還是會出錯，以下作法是參考這個 Nuxt Github 的 issue：

1. 安裝指令

npm install pinia @pinia/nuxt --legacy-peer-deps

2. 修改 nuxt.config 配置

export default defineNuxtConfig({
  modules: [
    // ...
    '@pinia/nuxt',
  ],
})

3. 完成！接下來就照著 Vue3 中使用 Pinia 的方法操作就可以了。

多國語系

目前 i18n 相關套件還在發展階段，要有踩雷的心理準備，引入方式有兩種，直接使用 vue-i18n 或是使用 nuxt/i18n。

vue-i18n

可以參考 vue-i18n 官方文件 來設置，文件中也有提到，目前只支援基本的內容文字變換，如果要替換 SEO 中寫在 tag 的資訊是做不到的。
以下是安裝步驟：

1. 安裝指令

npm install --save-dev vue-i18n

2. 接著建立 plugins 資料夾，在裡面新增檔案，檔名 i18n.ts（看專案習慣自行調整命名）。
3. 建立 locales 資料夾，在裡面新增各種語系的 json 檔。
4. 修改 plugins/i18n.ts 的內容

import { createI18n } from 'vue-i18n'
// 以下語系自行添加
import en from '../locales/en.json'
import fr from '../locales/fr.json'
import ja from '../locales/ja.json'
 
export default defineNuxtPlugin(({ vueApp }) => {
  const i18n = createI18n({
    legacy: false,
    globalInjection: true,
    locale: 'en',
    // 以下引入各語系
    messages: {
        en,
        fr,
        ja
    }
  })
 
  vueApp.use(i18n)
})

5. 最後可以參考官方文件的建議安裝 @intlify/unplugin-vue-i18n 這個套件來優化效能，以下是安裝指令：

npm install --save-dev @intlify/unplugin-vue-i18n

6. 修改 nuxt.config

import { defineNuxtConfig } from 'nuxt'
// 新增下面三項
import { resolve, dirname } from 'node:path'
import { fileURLToPath } from 'url'
import VueI18nVitePlugin from '@intlify/unplugin-vue-i18n/vite'
 
// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
  // 加入以下設定
  vite: {
    plugins: [
      VueI18nVitePlugin({
        include: [
          resolve(dirname(fileURLToPath(import.meta.url)), './locales/*.json')
        ]
      })
    ]
  }
})

7. 解決執行時跳出警告 You are running the esm-bundler build of vue-i18n. It is recommended to configure your bundler to explicitly replace feature flag globals with boolean literals to get proper tree-shaking in the final bundle.

• 這不是專屬 Nuxt 的問題，使用 i18n 都會遇到，在 Nuxt 中修改 nuxt.config 即可：

alias: {
'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js'
}

nuxt/i18n

目前版本還在 v8.0.0-alpha.1（google 直接搜尋只會看到 v7 的文件），因為看起來發展狀態比 vue-i18n 還更不成熟，以下只提供相關連結：

• nuxt/i18n github 進度討論串
• v8.0.0-alpha.1 - 官方文件
• v8.0.0-alpha.1 - github